<script>
import { TABLE_FIELD_QUARTER, TABLE_FIELD_YEAR } from '@/config'

/* IFTRUE_ONLY_NANCHANG
import { loadUpdateUnitDetails } from '@/api/enterpriseQuarterlyReport2'
FITRUE_ONLY_NANCHANG */
/* IFTRUE_NOT_NANCHANG */
import { loadUpdateUnitDetails } from '@/api/enterpriseQuarterlyReport'
/* FITRUE_NOT_NANCHANG */

import ArrowSelectMixin from '@/components/quarterly-account-table-new/arrow-select-mixin'
import ContextMenuMixin from '@/components/quarterly-account-table-new/context-menu-mixin'
import EnergyTableMixin from '@/components/quarterly-account-table-new/energy-table-mixin'
import { uuid } from '@/utils'

export default {
  name: 'enterprise-basic-information-table',
  mixins: [EnergyTableMixin, ContextMenuMixin, ArrowSelectMixin],
  data () {
    return {
      keys: [
        'productName',
        'quantity',
        'unitOfMeasurement',
        'quantityOne',
        'unitOfMeasurementOne',
        'numericalValue',
        'unitOfMeasurementTwo',
      ],
      /**
       * 报表数据格式
       */
      data: {
        id: '',
        ssdq: '',
        ssly: '',
        hy: '',
        dwlx: '',
        dwxxmc: '',
        shxydm: '',
        dwzcrq: '',
        dwzczb: '',
        fddbrxm: '',
        lxdh: '',
        sfyq: '',
        ssyqjtmc: '',
        dwdz: '',
        yzbm: '',
        xzqhdm: '',
        dzyx: '',
        nygljgmc: '',
        cz: '',
        zgjnldxm: '',
        lxdh1: '',
        nyglfzrxm: '',
        sj: '',
        nyglszh: '',
        sftgnygltxrz: '',
        tgrq: '',
        rzjg: '',

        bqgyzcz: '',
        sngyzcz: '',
        tbgyzcz: '',
        bqjgzs: '',
        snjgzs: '',
        tbjgzs: '',
        bqgyzczkbj: '',
        sngyzczkbj: '',
        tbgyzczkbj: '',
        bqxssr: '',
        snxssr: '',
        tbxssr: '',
        bqsjls: '',
        snsjls: '',
        tbsjls: '',
        bqcyry: '',
        sncyry: '',
        tbcyry: '',
        bqnyglsrs: '',
        snnyglsrs: '',
        tbnyglsrs: '',
        bqsccb: '',
        snsccb: '',
        tbsccb: '',
        bqnyxfcb: '',
        snnyxfcb: '',

        tbnyxfcb: '',
        bqnyxfzsccbbl: '',
        snnyxfzsccbbl: '',
        tbnyxfzsccbbl: '',
        bqzhnyxfl: '',
        snzhnyxfl: '',
        tbzhnyxfl: '',
        bqdwzczzhnh: '',
        sndwzczzhnh: '',
        tbdwzczzhnh: '',
        bqzzjrl: '',
        snzzjrl: '',
        tbzzjrl: '',

        // 增加值
        bqgyzjzkbj: '',
        sngyzjzkbj: '',
        tbgyzjzkbj: '',
        bqdwzjzzhnh: '',
        sndwzjzzhnh: '',
        tbdwzjzzhnh: '',

        bz: '',
      },
      lists: [],
      selfInformant: {
        principal: '',
        informant: '',
        telephone: '',
        date: '',
      },

      // 表序号
      seriesNo: '表1-1',

      // 基本信息直接带出不能编辑
      onlyFill: true
    }
  },
  computed: {
    /**
     *
     * @returns {{tbsjls: (number|string), bqdwzczzhnh: (string|number), tbgyzczkbj: (number|string), tbgyzcz: (number|string), tbdwzczzhnh: (string|number), tbnyxfcb: (number|string), tbxssr: (number|string), tbjgzs: (number|string), tbnyglsrs: (number|string), tbcyry: (number|string), tbsccb: (number|string), tbnyxfzsccbbl: (string|number), tbzhnyxfl: (number|string), bqnyxfzsccbbl: (string|number)}}
     */
    calc () {
      const {
        sndwzczzhnh,
        bqzhnyxfl, snzhnyxfl,
        snnyxfzsccbbl,
        bqnyxfcb, snnyxfcb,
        bqsccb, snsccb,
        bqnyglsrs, snnyglsrs,
        bqcyry, sncyry,
        bqsjls, snsjls,
        bqxssr, snxssr,
        bqgyzczkbj, sngyzczkbj,
        bqjgzs, snjgzs,
        bqgyzcz, sngyzcz,
        bqgyzjzkbj, sngyzjzkbj,
        sndwzjzzhnh,
      } = this.data

      // 同比增长率 = （本期数 - 上期数）/ 上期数 ×100%
      const tb = (b, s) => {
        // 如果没有“本期数”或”本期数“为0，则返回空
        if (!b) return ''
        const n = +(((+b) - (+s)) * 100 / (+s)).toFixed(2)
        return Number.isFinite(n) ? n : ''
      }

      // 能源消费占生产成本比例 = 能源消费成本 ÷ 生产成本 x 100%
      const qb = (a, b) => {
        const n = +(((+a) * 100 / (+b)).toFixed(2))
        return Number.isFinite(n) ? n : ''
      }

      // 单位总产值综合能耗 ＝ 综合能源消费量 ÷ 工业总产值（可比价）
      // 单位增加值综合能耗（当量值）= 综合能源消费量 ÷ 工业增加值（可比价）
      // 吨标准煤/万元 = 万吨标准煤 * 10000 ÷ 万元
      const xb = (a, b) => {
        if (!a) return '';
        const n = +(((+a) * 10000 / (+b)).toFixed(4))
        return Number.isFinite(n) ? n : ''
      }

      // 本期能源消费占生产成本比例
      const bqnyxfzsccbbl = qb(bqnyxfcb, bqsccb)
      const tbnyxfzsccbbl = tb(bqnyxfzsccbbl, snnyxfzsccbbl)

      // 单位产值综合能耗
      const bqdwzczzhnh = xb(bqzhnyxfl, bqgyzczkbj)
      const tbdwzczzhnh = tb(bqdwzczzhnh, sndwzczzhnh)

      // 单位增加值综合能耗（当量值）
      const bqdwzjzzhnh = xb(bqzhnyxfl, bqgyzjzkbj)
      const tbdwzjzzhnh = tb(bqdwzjzzhnh, sndwzjzzhnh)

      return {
        // 综合能源消费量  （本期值是从结构附表中获取的）
        tbzhnyxfl: tb(bqzhnyxfl, snzhnyxfl),

        tbnyxfcb: tb(bqnyxfcb, snnyxfcb),
        tbsccb: tb(bqsccb, snsccb),
        tbnyglsrs: tb(bqnyglsrs, snnyglsrs),
        tbcyry: tb(bqcyry, sncyry),
        tbsjls: tb(bqsjls, snsjls),
        tbxssr: tb(bqxssr, snxssr),
        tbgyzczkbj: tb(bqgyzczkbj, sngyzczkbj),
        tbjgzs: tb(bqjgzs, snjgzs),
        tbgyzcz: tb(bqgyzcz, sngyzcz),

        // 工业增加值（可比价）
        tbgyzjzkbj: tb(bqgyzjzkbj, sngyzjzkbj),

        // 能源消费占生产成本比例
        bqnyxfzsccbbl,
        tbnyxfzsccbbl,

        // 单位产值综合能耗
        bqdwzczzhnh,
        tbdwzczzhnh,

        // 单位增加值综合能耗（当量值）
        bqdwzjzzhnh,
        tbdwzjzzhnh,
      }
    },
    bzError () {
      const { tbzhnyxfl, tbdwzczzhnh, bz } = this.data
      return bz === '' && !this.readonly && (Math.abs(tbzhnyxfl) > 5 || Math.abs(tbdwzczzhnh) > 5);
    },
    hasError () {
      // “情况说明”又不要校验了
      return false && this.bzError;
    }
  },
  created () {
    this.loadList = loadUpdateUnitDetails
    this.lists = [
      {
        uuid: uuid(),
        data: Array(this.keys.length).fill(''),
      },
    ]
  },
  methods: {
    _initLists (l) {
      this.data = this.$options.data().data
    },
    // 初始化表数据
    // fix：08-14
    // 第二个参数 loadOnClickPrevButton ，是否“本期”填充“上期”数据
    // 第三个参数 needInformant ，加载上期数据时是否需要覆盖填报人信息
    initLists (params, loadOnClickPrevButton, needInformant = true) {
      const transfer = (array) => {
        const { list, ...obj } = array[0] || {}
        return {
          ...this.$options.data().data,
          ...obj,
        }
      }
      // 查询企业填报的数据
      if (this.loadList) {
        params = params || {
          [TABLE_FIELD_YEAR]: this.year,
          [TABLE_FIELD_QUARTER]: this.quarter,
          tenantId: this.enterpriseId
        }
        return this.loadList({
          ...params,
          loadOnClickPrevButton,
        }).then(res => {
          if (res.code === 200) {
            const data = res.data || []

            const { bqzhnyxfl } = this.data;
            this.data = transfer(data)
            // 加载上期数据“综合能源消费量（当量值）”不变
            if (loadOnClickPrevButton) {
              this.data.bqzhnyxfl = bqzhnyxfl;
            }

            const item = data[0] || {}
            const list = item.list
            const vv = { ...item }

            this.isKept = !needInformant;
            if (needInformant) {
              this.selfInformant = {
                ...this.selfInformant,
                principal: vv.personInCharge,
                informant: vv.informer,
                telephone: vv.telephone,
                date: vv.fillInDate,
              }
            }

            if (list && list.length) {
              this.lists = list.map(v => {
                return {
                  uuid: uuid(),
                  informant: {
                    personInCharge: vv.personInCharge,
                    informer: vv.informer,
                    telephone: vv.telephone,
                    fillInDate: vv.fillInDate,
                  },
                  data: [
                    'productName',
                    'quantity',
                    'unitOfMeasurement',
                    'quantityOne',
                    'unitOfMeasurementOne',
                    'numericalValue',
                    'unitOfMeasurementTwo',
                  ].map(prop => String(v[prop] || ''))
                }
              })
            } else if (this.fromGovernmentSide) {
              this.lists = []
            } else {
              this.lists = [
                {
                  uuid: uuid(),
                  data: Array(this.keys.length).fill(''),
                },
              ]
            }

            this.$nextTick(() => {
              this.initInputIndex()
            })
          }
        }).catch(() => {
          this._initLists(0)
          this.$nextTick(() => {
            this.initInputIndex()
          })
        })
      }
    },

    // 暴露给使用者的获取报表数据的方法
    getData () {
      /**
       *
       * @type {{
       *   updateTime: string;
       *   updateId: string;
       *   creationId: string;
       *   creationTime: string;
       *   id: string;
       * }}
       */
      const data = { ...this.data, ...this.calc }
      delete data.updateId
      delete data.updateTime
      delete data.creationId
      delete data.creationTime
      delete data.id

      const props = this.keys
      const lists = this.lists.filter(v => v.data.some(vv => vv !== ''))
      return {
        data: data,
        list: lists.map(v => {
          v = v.data
          return props.reduce((acc, vv, ii) => {
            acc[vv] = String(v[ii] || '')
            return acc
          }, {})
        })
      }
    },

    clickListsTrHandler (index) {
      this.rowIndex = index
    },

    createAEmptyRow () {
      return Array(this.keys.length).fill('')
    },
  },
}
</script>

<template>
  <div class="bg-white height-100 quarterly-account-table position-relative overflow-hidden">
    <slot name="title" :title="title" :series-no="seriesNo">
      <h2 class="table-title">
        {{title}}
      </h2>
    </slot>
    <el-scrollbar :style="{height: 'calc(100% - 80px)', width: '100%'}" wrap-style="overflow-x: hidden;">
      <table class="report-table enterprise-basic-information-table" style="margin-top: 0;">
        <tbody ref="tbody">
          <tr>
            <th>所属地区</th>
            <td v-if="onlyFill" class="is-computed-cell">
              <div class="span-cell">
                {{data.ssdq}}
              </div>
            </td>
            <td v-else>
              <div class="input-cell">
                <input type="text" v-model="data.ssdq" @click="clickHandler">
              </div>
            </td>
            <th>所属领域</th>
            <td v-if="onlyFill" class="is-computed-cell">
              <div class="span-cell">
                {{data.ssly}}
              </div>
            </td>
            <td v-else>
              <div class="input-cell">
                <input type="text" v-model="data.ssly" @click="clickHandler">
              </div>
            </td>
            <th>行业</th>
            <td v-if="onlyFill" class="is-computed-cell">
              <div class="span-cell">
                {{data.hy}}
              </div>
            </td>
            <td v-else>
              <div class="input-cell">
                <input type="text" v-model="data.hy" @click="clickHandler">
              </div>
            </td>
            <th>单位类型</th>
            <td v-if="onlyFill" class="is-computed-cell">
              <div class="span-cell">
                {{data.dwlx}}
              </div>
            </td>
            <td v-else>
              <div class="input-cell">
                <input type="text" v-model="data.dwlx" @click="clickHandler">
              </div>
            </td>
          </tr>
          <tr>
            <th>单位详细名称</th>
            <td v-if="onlyFill" colspan="3" class="is-computed-cell">
              <div class="span-cell">
                {{data.dwxxmc}}
              </div>
            </td>
            <td v-else colspan="3">
              <div class="input-cell">
                <input type="text" v-model="data.dwxxmc" @click="clickHandler">
              </div>
            </td>
            <th>统一社会信用代码</th>
            <td v-if="onlyFill" colspan="3" class="is-computed-cell">
              <div class="span-cell">
                {{data.shxydm}}
              </div>
            </td>
            <td v-else colspan="3">
              <div class="input-cell">
                <input type="text" v-model="data.shxydm" @click="clickHandler">
              </div>
            </td>
          </tr>
          <tr>
            <th>单位注册日期</th>
            <td v-if="onlyFill" colspan="3" class="is-computed-cell">
              <div class="span-cell">
                {{data.dwzcrq}}
              </div>
            </td>
            <td v-else colspan="3">
              <div class="input-cell">
                <input type="text" v-model="data.dwzcrq" @click="clickHandler">
              </div>
            </td>
            <th>单位注册资本（万元）</th>
            <td v-if="onlyFill" colspan="3" class="is-computed-cell">
              <div class="span-cell">
                {{data.dwzczb}}
              </div>
            </td>
            <td v-else colspan="3">
              <div class="input-cell">
                <input type="text" v-model="data.dwzczb" @click="clickHandler">
              </div>
            </td>
          </tr>
          <tr>
            <th>法定代表人姓名</th>
            <td v-if="onlyFill" colspan="3" class="is-computed-cell">
              <div class="span-cell">
                {{data.fddbrxm}}
              </div>
            </td>
            <td v-else colspan="3">
              <div class="input-cell">
                <input type="text" v-model="data.fddbrxm" @click="clickHandler">
              </div>
            </td>
            <th>联系电话（区号）</th>
            <td v-if="onlyFill" colspan="3" class="is-computed-cell">
              <div class="span-cell">
                {{data.lxdh}}
              </div>
            </td>
            <td v-else colspan="3">
              <div class="input-cell">
                <input type="text" v-model="data.lxdh" @click="clickHandler">
              </div>
            </td>
          </tr>
          <tr>
            <th>是否央企</th>
            <td v-if="onlyFill" colspan="3" class="is-computed-cell">
              <div class="span-cell">
                {{data.sfyq}}
              </div>
            </td>
            <td v-else colspan="3">
              <div class="input-cell">
                <input type="text" v-model="data.sfyq" @click="clickHandler">
              </div>
            </td>
            <th>所属央企集团名称</th>
            <td v-if="onlyFill" colspan="3" class="is-computed-cell">
              <div class="span-cell">
                {{data.ssyqjtmc}}
              </div>
            </td>
            <td v-else colspan="3">
              <div class="input-cell">
                <input type="text" v-model="data.ssyqjtmc" @click="clickHandler">
              </div>
            </td>
          </tr>
          <tr>
            <th>单位地址</th>
            <td v-if="onlyFill" colspan="3" class="is-computed-cell">
              <div class="span-cell">
                {{data.dwdz}}
              </div>
            </td>
            <td v-else colspan="3">
              <div class="input-cell">
                <input type="text" v-model="data.dwdz" @click="clickHandler">
              </div>
            </td>
            <th>邮政编码</th>
            <td v-if="onlyFill" colspan="3" class="is-computed-cell">
              <div class="span-cell">
                {{data.yzbm}}
              </div>
            </td>
            <td v-else colspan="3">
              <div class="input-cell">
                <input type="text" v-model="data.yzbm" @click="clickHandler">
              </div>
            </td>
          </tr>
          <tr>
            <th>行政区划代码</th>
            <td v-if="onlyFill" colspan="3" class="is-computed-cell">
              <div class="span-cell">
                {{data.xzqhdm}}
              </div>
            </td>
            <td v-else colspan="3">
              <div class="input-cell">
                <input type="text" v-model="data.xzqhdm" @click="clickHandler">
              </div>
            </td>
            <th>电子邮箱</th>
            <td v-if="onlyFill" colspan="3" class="is-computed-cell">
              <div class="span-cell">
                {{data.dzyx}}
              </div>
            </td>
            <td v-else colspan="3">
              <div class="input-cell">
                <input type="text" v-model="data.dzyx" @click="clickHandler">
              </div>
            </td>
          </tr>
          <tr>
            <th>能源管理机构名称</th>
            <td v-if="onlyFill" colspan="3" class="is-computed-cell">
              <div class="span-cell">
                {{data.nygljgmc}}
              </div>
            </td>
            <td v-else colspan="3">
              <div class="input-cell">
                <input type="text" v-model="data.nygljgmc" @click="clickHandler">
              </div>
            </td>
            <th>传真（区号）</th>
            <td v-if="onlyFill" colspan="3" class="is-computed-cell">
              <div class="span-cell">
                {{data.cz}}
              </div>
            </td>
            <td v-else colspan="3">
              <div class="input-cell">
                <input type="text" v-model="data.cz" @click="clickHandler">
              </div>
            </td>
          </tr>
          <tr>
            <th>主管节能领导姓名</th>
            <td v-if="onlyFill" colspan="3" class="is-computed-cell">
              <div class="span-cell">
                {{data.zgjnldxm}}
              </div>
            </td>
            <td v-else colspan="3">
              <div class="input-cell">
                <input type="text" v-model="data.zgjnldxm" @click="clickHandler">
              </div>
            </td>
            <th>联系电话（区号）</th>
            <td v-if="onlyFill" colspan="3" class="is-computed-cell">
              <div class="span-cell">
                {{data.lxdh1}}
              </div>
            </td>
            <td v-else colspan="3">
              <div class="input-cell">
                <input type="text" v-model="data.lxdh1" @click="clickHandler">
              </div>
            </td>
          </tr>
          <tr>
            <th>能源管理负责人姓名</th>
            <td v-if="onlyFill" class="is-computed-cell">
              <div class="span-cell">
                {{data.nyglfzrxm}}
              </div>
            </td>
            <td v-else>
              <div class="input-cell">
                <input type="text" v-model="data.nyglfzrxm" @click="clickHandler">
              </div>
            </td>
            <th>手机</th>
            <td v-if="onlyFill" class="is-computed-cell">
              <div class="span-cell">
                {{data.sj}}
              </div>
            </td>
            <td v-else>
              <div class="input-cell">
                <input type="text" v-model="data.sj" @click="clickHandler">
              </div>
            </td>
            <th>能源管理师证号</th>
            <td v-if="onlyFill" colspan="3" class="is-computed-cell">
              <div class="span-cell">
                {{data.nyglszh}}
              </div>
            </td>
            <td v-else colspan="3">
              <div class="input-cell">
                <input type="text" v-model="data.nyglszh" @click="clickHandler">
              </div>
            </td>
          </tr>
          <tr>
            <th>是否通过能源管理体系认证</th>
            <td v-if="onlyFill" class="is-computed-cell">
              <div class="span-cell">
                {{data.sftgnygltxrz}}
              </div>
            </td>
            <td v-else>
              <div class="input-cell">
                <input type="text" v-model="data.sftgnygltxrz" @click="clickHandler">
              </div>
            </td>
            <th>通过日期</th>
            <td v-if="onlyFill" class="is-computed-cell">
              <div class="span-cell">
                {{data.tgrq}}
              </div>
            </td>
            <td v-else>
              <div class="input-cell">
                <input type="text" v-model="data.tgrq" @click="clickHandler">
              </div>
            </td>
            <th>认证机构</th>
            <td v-if="onlyFill" colspan="3" class="is-computed-cell">
              <div class="span-cell">
                {{data.rzjg}}
              </div>
            </td>
            <td v-else colspan="3">
              <div class="input-cell">
                <input type="text" v-model="data.rzjg" @click="clickHandler">
              </div>
            </td>
          </tr>
          <tr>
            <th colspan="2">指标名称</th>
            <th>计量单位</th>
            <th>本期值</th>
            <th>上年值</th>
            <th>同比变化率（%）</th>
            <th colspan="2">产值及能源消费变化 情况说明</th>
          </tr>
          <tr>
            <th colspan="2">工业总产值(可比价)</th>
            <th>万元</th>
            <td :class="{'is-computed-cell': readonly}">
              <div v-if="readonly" class="span-cell">
                {{data.bqgyzczkbj}}
              </div>
              <div v-else class="input-cell">
                <input type="text" v-model="data.bqgyzczkbj" v-only-positive-number="val => data.bqgyzczkbj = val" @click="clickHandler">
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{data.sngyzczkbj}}
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{calc.tbgyzczkbj}}
              </div>
            </td>
            <td rowspan="12" colspan="2" class="special-cell">
              <div v-if="readonly" class="span-cell" style="word-break: break-all;word-wrap: break-word;">
                {{data.bz}}
              </div>
              <div v-else class="input-cell" style="height: 360px;">
                <textarea :rows="5" :cols="30" :maxlength="100" wrap="soft" style="resize: none;" v-model="data.bz" @click="clickHandler"></textarea>
              </div>
            </td>
          </tr>
          <tr>
            <th colspan="2">销售收入</th>
            <th>万元</th>
            <td :class="{'is-computed-cell': readonly}">
              <div v-if="readonly" class="span-cell">
                {{data.bqxssr}}
              </div>
              <div v-else class="input-cell">
                <input type="text" v-model="data.bqxssr" v-only-positive-number="val => data.bqxssr = val" @click="clickHandler">
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{data.snxssr}}
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{calc.tbxssr}}
              </div>
            </td>
          </tr>
          <tr>
            <th colspan="2">上缴利税</th>
            <th>万元</th>
            <td :class="{'is-computed-cell': readonly}">
              <div v-if="readonly" class="span-cell">
                {{data.bqsjls}}
              </div>
              <div v-else class="input-cell">
                <input type="text" v-model="data.bqsjls" v-only-positive-number="val => data.bqsjls = val" @click="clickHandler">
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{data.snsjls}}
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{calc.tbsjls}}
              </div>
            </td>
          </tr>
          <tr>
            <th colspan="2">从业人员</th>
            <th>人</th>
            <td :class="{'is-computed-cell': readonly}">
              <div v-if="readonly" class="span-cell">
                {{data.bqcyry}}
              </div>
              <div v-else class="input-cell">
                <input type="text" v-model="data.bqcyry" v-only-integer="val => data.bqcyry = val" @click="clickHandler">
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{data.sncyry}}
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{calc.tbcyry}}
              </div>
            </td>
          </tr>
          <tr>
            <th colspan="2">能源管理师人数</th>
            <th>人</th>
            <td :class="{'is-computed-cell': readonly}">
              <div v-if="readonly" class="span-cell">
                {{data.bqnyglsrs}}
              </div>
              <div v-else class="input-cell">
                <input type="text" v-model="data.bqnyglsrs" v-only-integer="val => data.bqnyglsrs = val" @click="clickHandler">
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{data.snnyglsrs}}
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{calc.tbnyglsrs}}
              </div>
            </td>
          </tr>
          <tr>
            <th colspan="2">综合能源消费量(当量值)</th>
            <th>万吨标准煤</th>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{data.bqzhnyxfl}}
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{data.snzhnyxfl}}
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{calc.tbzhnyxfl}}
              </div>
            </td>
          </tr>
          <tr>
            <th colspan="2">生产成本</th>
            <th>万元</th>
            <td :class="{'is-computed-cell': readonly}">
              <div v-if="readonly" class="span-cell">
                {{data.bqsccb}}
              </div>
              <div v-else class="input-cell">
                <input type="text" v-model="data.bqsccb" v-only-positive-number="val => data.bqsccb = val" @click="clickHandler">
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{data.snsccb}}
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{calc.tbsccb}}
              </div>
            </td>
          </tr>
          <tr>
            <th colspan="2">能源消费成本</th>
            <th>万元</th>
            <td :class="{'is-computed-cell': readonly}">
              <div v-if="readonly" class="span-cell">
                {{data.bqnyxfcb}}
              </div>
              <div v-else class="input-cell">
                <input type="text" v-model="data.bqnyxfcb" v-only-positive-number="val => data.bqnyxfcb = val" @click="clickHandler">
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{data.snnyxfcb}}
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{calc.tbnyxfcb}}
              </div>
            </td>
          </tr>
          <tr>
            <th colspan="2">能源消费占生产成本比例</th>
            <th>%</th>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{calc.bqnyxfzsccbbl}}
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{data.snnyxfzsccbbl}}
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{calc.tbnyxfzsccbbl}}
              </div>
            </td>
          </tr>
          <tr>
            <th colspan="2">万元工业总产值综合能耗</th>
            <th>吨标准煤/万元</th>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{calc.bqdwzczzhnh}}
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{data.sndwzczzhnh}}
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{calc.tbdwzczzhnh}}
              </div>
            </td>
          </tr>
          <tr>
            <th colspan="2">工业增加值（可比价）</th>
            <th>万元</th>
            <td :class="{'is-computed-cell': readonly}">
              <div v-if="readonly" class="span-cell">
                {{data.bqgyzjzkbj}}
              </div>
              <div v-else class="input-cell">
                <input type="text" v-model="data.bqgyzjzkbj" v-only-positive-number="val => data.bqgyzjzkbj = val" @click="clickHandler">
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{data.sngyzjzkbj}}
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{calc.tbgyzjzkbj}}
              </div>
            </td>
          </tr>
          <tr>
            <th colspan="2">单位增加值综合能耗（当量值）</th>
            <th>吨标准煤/万元</th>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{calc.bqdwzjzzhnh}}
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{data.sndwzjzzhnh}}
              </div>
            </td>
            <td class="is-computed-cell">
              <div class="span-cell">
                {{calc.tbdwzjzzhnh}}
              </div>
            </td>
          </tr>
          <tr>
            <th colspan="2" rowspan="2">主要产品名称</th>
            <th colspan="2">年产能</th>
            <th colspan="2">年产量</th>
            <th colspan="2" class="with-border-top">单位产品能耗</th>
          </tr>
          <tr>
            <th>数量</th>
            <th>计量单位</th>
            <th>数量</th>
            <th>计量单位</th>
            <th>数值</th>
            <th>计量单位</th>
          </tr>
          <tr v-for="(item, index) in lists" :key="item.uuid" @click="clickListsTrHandler(index)">
            <td v-for="(v, i) in item.data" :key="i" :colspan="i === 0 ? 2 : 1" >
              <div v-if="readonly" class="span-cell" :class="{'is-computed-cell': readonly}">
                {{item.data[i]}}
              </div>
              <div v-else class="input-cell">
                <input v-if="i % 2 !== 0" type="text" v-model="item.data[i]" v-only-positive-number="val => item.data[i] = val" @contextmenu="onContextmenu($event, index)" @click="clickHandler">
                <input v-else type="text" v-model="item.data[i]" @contextmenu="onContextmenu($event, index)" @click="clickHandler">
              </div>
            </td>
          </tr>
        </tbody>
      </table>
      <report-person ref="reportPerson" :is-kept="isKept" :informer="selfInformant" :readonly="readonly"></report-person>
      <div v-if="tableDescription" class="fill-description">
        <!-- <p>说明：</p>
        <p>1．所属地区填写用能单位所在的省（市、自治区）。</p>
        <p>2．未开展能源管理师试点的省（自治区、直辖市）能源管理师人数填0，证号可不填。</p>
        <p>3．单位产值综合能耗＝综合能源消费量÷工业总产值（可比价）</p>
        <p>4．若综合能源消费量、产值能耗指标与上年同比变化率超过5%时，要填写说明，字数在100个汉字以内。</p>
        <p>5．所列产品的能源消耗量不低于企业总能耗的80%。</p>
        <p>6．年产能是指相应产品主体设备的年设计产能。</p> -->

        <el-input type="textarea" class="width-100 table-description" :value="tableDescription" readonly autosize></el-input>
      </div>
    </el-scrollbar>
    <transition name="el-fade-in">
      <ul v-if="visible" :style="{left:left+'px', top: top + 'px'}" class="contextmenu">
        <li style="color:var(--danger-color);" @click="delRow">删除当前行</li>
        <li class="divider"></li>
        <li @click="prependRow">在上方插入一行</li>
        <li @click="appendRow">在下方插入一行</li>
      </ul>
    </transition>
  </div>
</template>
